var Player;
(function (Player) {
    Player["X"] = "x";
    Player["O"] = "o";
})(Player || (Player = {}));
// 判赢数组
var winsArr = [
    [0, 1, 2], [3, 4, 5], [6, 7, 8],
    [0, 3, 6], [1, 4, 7], [2, 5, 8],
    [0, 4, 8], [2, 4, 6] // 斜
];
var cells = document.querySelectorAll('.cell');
var currentPlayer;
var gameBoard = document.querySelector('#bord');
var message = document.querySelector('#message');
var winner = document.querySelector('#winner');
var restart = document.querySelector('#restart');
var steps;
restart.addEventListener('click', startGame);
startGame();
function startGame() {
    message.style.display = 'none';
    steps = 0;
    currentPlayer = Player.X;
    gameBoard.classList.remove(Player.X, Player.O);
    gameBoard.classList.add(Player.X);
    cells.forEach(function (item) {
        var cell = item;
        cell.classList.remove(Player.X, Player.O);
        cell.removeEventListener('click', clickCell);
        cell.addEventListener('click', clickCell, { once: true });
    });
}
// cells.forEach(function(item){
//     let cell = item as HTMLDivElement
//     //console.log(item);
//     cell.addEventListener('click',clickCell,{once:true})
// })
function clickCell(event) {
    //console.log('click',event.target);
    var target = event.target;
    target.classList.add(currentPlayer);
    steps++;
    //调用判赢函数
    var isWin = checkWin(currentPlayer);
    if (isWin) {
        //console.log('该玩家获胜啦！',currentPlayer);
        message.style.display = 'block';
        winner.innerText = currentPlayer + ' 赢了';
        return;
    }
    if (steps === 9) {
        message.style.display = 'block';
        winner.innerText = '平局';
        return;
    }
    currentPlayer = currentPlayer === Player.X ? Player.O : Player.X;
    //处理下一步提示
    gameBoard.classList.remove(Player.X, Player.O);
    gameBoard.classList.add(currentPlayer);
}
//封装判赢函数
function checkWin(player) {
    /*
   实现判赢函数：

   1 使用 some 方法遍历数组，并使用 some 方法的返回值作为判赢函数的返回结果。
   2 在 some 方法的回调函数中，获取到每种获胜情况对应的 3 个单元格元素。
   3 判断这 3 个单元格元素是否同时包含当前玩家的类名。
   4 如果包含（玩家获胜），就在回调函数中返回 true 停止循环；
     否则，返回 false，继续下一次循环。
 */
    return winsArr.some(function (item) {
        // 获取到每种获胜情况对应的 3 个单元格元素
        // 2.1 先拿到每种获胜情况的三个索引
        // console.log(item)
        var cellIndex1 = item[0];
        var cellIndex2 = item[1];
        var cellIndex3 = item[2];
        // console.log(cellIndex1, cellIndex2, cellIndex3)
        // 2.2 通过这三个索引从cells中获取到对应的单元格元素
        // let cell1 = cells[cellIndex1]
        // let cell2 = cells[cellIndex2]
        // let cell3 = cells[cellIndex3]
        //console.log(cell1, cell2, cell3)
        if (
        // cells[cellIndex1].classList.contains(player) &&
        // cells[cellIndex2].classList.contains(player) &&
        // cells[cellIndex3].classList.contains(player) 
        hasClass(cells[cellIndex1], player) &&
            hasClass(cells[cellIndex2], player) &&
            hasClass(cells[cellIndex3], player)) {
            return true;
        }
        return false;
    });
}
function hasClass(el, name) {
    return el.classList.contains(name);
}
